<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>go-admin-auth</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="../AdminLTE-3.0.5/plugins/fontawesome-free/css/all.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="../AdminLTE-3.0.5/dist/css/adminlte.min.css">
    <link rel="stylesheet" href="../static/css/optimization.css">
</head>
<body class="hold-transition sidebar-mini">
<div class="wrapper">
    <!-- Navbar -->
    <nav class="main-header navbar navbar-expand navbar-white navbar-light">
        <!-- Left navbar links -->
        <ul class="navbar-nav">
            <li class="nav-item">
                <a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
            </li>
            <li class="nav-item d-none d-sm-inline-block">
                <a href="/themes/default/admin/index.html" class="nav-link">主页</a>
            </li>
        </ul>

        <!-- SEARCH FORM -->
        <!-- <form class="form-inline ml-3">
          <div class="input-group input-group-sm">
            <input class="form-control form-control-navbar" type="search" placeholder="Search" aria-label="Search">
            <div class="input-group-append">
              <button class="btn btn-navbar" type="submit">
                <i class="fas fa-search"></i>
              </button>
            </div>
          </div>
        </form> -->

        <!-- Right navbar links -->
        <ul class="navbar-nav ml-auto">
            <!-- Messages Dropdown Menu -->

            <!-- Notifications Dropdown Menu -->
            <li class="nav-item">
                    <a href="/admin-api/v1/token" class="dropdown-item dropdown-footer"
                       onclick="logout(this);"
                       >退出登录</a>
            </li>
        </ul>
    </nav>
    <!-- /.navbar -->

    <!-- Main Sidebar Container -->
    <aside class="main-sidebar sidebar-dark-primary elevation-4">
        <!-- Brand Logo -->
        <a href="#" class="brand-link">
            <img src="../AdminLTE-3.0.5/dist/img/AdminLTELogo.png"
                 alt="AdminLTE Logo"
                 class="brand-image img-circle elevation-3"
                 style="opacity: .8">
            <span class="brand-text font-weight-light">go-admin-auth</span>
        </a>

        <!-- Sidebar -->
        <div class="sidebar">
            <!-- Sidebar user (optional) -->

            <!-- Sidebar Menu -->
            <nav class="mt-2">
                <ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu"
                    data-accordion="false">
                    <!-- Add icons to the links using the .nav-icon class
                         with font-awesome or any other icon font library -->

                    <li class="nav-header" id="sidebar-menu"></li>

                </ul>
            </nav>
            <!-- /.sidebar-menu -->
        </div>
        <!-- /.sidebar -->
    </aside>

    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1>组织管理</h1>
                    </div>

                </div>
            </div><!-- /.container-fluid -->
        </section>

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-12">
                    <div class="card">
                        <div class="card-header">
                            <!--<h3 class="card-title">Fixed Header Table</h3>-->
                            <section class="content" style="font-size: 0.5rem;">
                                <form class="form-horizontal" action="#">
                                    <div class="row">
                                        <div class="form-group col-4">
                                            <div class="row">
                                                <label class="col-sm-3 col-form-label">上级组织</label>
                                                <div class="col-sm-9">
                                                    <select name="parent_path" id="" class="form-control auto-complete"
                                                            data-dft="/"
                                                            data-url="/admin-api/v1/org_options" data-ref=""
                                                            data-name="name" data-value="path">
                                                        <option value="/">全部</option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-group col-4">
                                            <div class="row">
                                                <label class="col-sm-3 col-form-label">组织名</label>
                                                <div class="col-sm-9">
                                                    <input name="name" type="text" class="form-control" placeholder="">
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-group col-2">
                                            <button type="button" class="btn btn-sm btn-info search-now">查询</button>
                                        </div>
                                    </div>

                                </form>
                            </section>
                        </div>
                        <!-- /.card-header -->
                        <div class="card-body table-responsive p-0">
                            <section class="container" style="padding: 5px 10px;">
                                <div class="row ">
                                    <div class="col-sm-12">
                                        <a class="btn btn-sm btn-outline-primary" href="add.html">添加</a>
                                    </div>
                                </div>
                            </section>
                            <table class="table table-head-fixed text-nowrap">
                                <thead>
                                <tr>
                                    <th>ID</th>
                                    <th>上级部门名</th>
                                    <th>部门名</th>
                                    <th>等级</th>
                                    <th>路径</th>
                                    <th>排序(同级有效)</th>
                                    <th>是否隐藏</th>
                                    <th>创建人</th>
                                    <th>更新人</th>
                                    <th>操作</th>
                                </tr>
                                </thead>
                                <tbody id="table-body">

                                </tbody>
                            </table>
                        </div>

                        <!-- /.card-body -->
                        <div class="card-footer clearfix" id="pagination">

                        </div>
                    </div>
                    <!-- /.card -->
                </div>
            </div>
        </section>
        <!-- /.content -->
    </div>
    <!-- /.content-wrapper -->


    <!-- Control Sidebar -->
    <aside class="control-sidebar control-sidebar-dark">
        <!-- Control sidebar content goes here -->
    </aside>
    <!-- /.control-sidebar -->
</div>
<!-- ./wrapper -->

<!-- jQuery -->
<script src="../AdminLTE-3.0.5/plugins/jquery/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script src="../AdminLTE-3.0.5/plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- AdminLTE App -->
<script src="../AdminLTE-3.0.5/dist/js/adminlte.min.js"></script>

<script src="../static/plugins/jquery-tmpl/jquery.tmpl.js"></script>
<link rel="stylesheet" href="../static/plugins/pagination/dist/pagination.css">
<script src="../static/plugins/pagination/dist/pagination.js"></script>

<script id="sidebar-level-1" type="text/x-jquery-tmpl">
  {{if $data.child}}
  <li class="nav-item has-treeview">
    <a href="${uri}" class="nav-link">
      <i class="nav-icon fas fa-tree"></i>
      <p>
        ${name}
        <i class="right fas fa-angle-left"></i>
      </p>
    </a>
    <ul class="nav nav-treeview">
      {{tmpl($data.child) '#sidebar-level-1'}}
    </ul>
  </li>
  {{else}}
  <li class="nav-item">
    <a href="${theme_uri}" class="nav-link">
      <i class="nav-icon far fa-circle"></i>
      <p>
        ${name}
      </p>
    </a>
  </li>
  {{/if}}
</script>
<script id="table-list" type="text/x-jquery-tmpl">
<tr>
    <td>${id}</td>
    <td>${parent_name}</td>
    <td>${name}</td>
    <td>${level}</td>
    <td>${path}</td>
    <td>${order_no}</td>
    <td>${status_desc}</td>
    <td>${create_username}</td>
    <td>${update_username}</td>
    <td>{{html operation}}</td>
</tr>
</script>

<link rel="stylesheet" href="../static/plugins/jquery-toast-plugin-1.3.2/dist/jquery.toast.min.css">
<script src="../static/plugins/jquery-toast-plugin-1.3.2/dist/jquery.toast.min.js"></script>
<script src="../static/js/admin.common.js"></script>

<script>
    let sourceUrl = window.location.origin + "/admin-api/v1/org";

    callback = function (data, pagination) {
        for (let i = 0; i < data.length; i++) {
            let buttons = '';
            // buttons += genButtonView(window.location.origin + '/admin/menu/view.html');
            buttons += genButtonEdit('edit.html?id=' + data[i].id);
            buttons += ' ' + genButtonDel(sourceUrl + '/' + data[i].id);
            data[i].operation = buttons;
        }

        $('#table-list').tmpl(data).appendTo('#table-body');
    }

    loadList(sourceUrl, callback)

    $(document).ready(function () {

    })
</script>

</body>
</html>
